import React from 'react'
import { connect } from 'dva'
import { Form, Button, Modal, Popconfirm, Table, Row, Col, Input, Select, Cascader, Icon, Checkbox, DatePicker } from 'antd'
import { Link, hashHistory } from 'dva/router'
import config from 'config/config'
import { mapStateToProps } from 'utils/view_utils'
import styles from './commissionInvoiceListStyle.less'
import ListPage from 'widget/PageTmpl/ListPage'
import classnames from 'classnames/bind';
let cx = classnames.bind(styles);
import { CustomCard } from '../../../widget/Grid/CustomCard'
import FlagBtn from 'widget/FlagBtn/FlagView'
import { func } from 'prop-types'
const confirm = Modal.confirm;
let $child = null
const commissionPaymentListView = function ({ dispatch, model, form }) {
  // 表单的子函数
  const { resetFields, getFieldDecorator, validateFields, setFieldsValue } = form
  // 取出model对象，命名空间
  const { modelObj, namespace } = model
  // modelObj.xxx获取model中状态机的值
  let { areaList, area1, biz, products, writeOffList, downDisable,
    taxServiceStatusList,
    taxSyncStatusList } = modelObj

  const down = () => {
    dispatch({
      type: `${namespace}/down`,
      payload: {}
    })
  }
  function downImg(item, index) {
    if (item.taxSyncStatus != 4) {
      return false
    }
    if (downDisable && downDisable.length == 0) {
      console.log('$child', $child)
      let dataSources = $child ? $child.state.biz.tableData.dataSource : []
      for (let i = 0; i < dataSources.length; i++) {
        dataSources[i].isclikdown = false
      }
      dataSources[index].isclikdown = true
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { downDisable: dataSources }
      })
    } else {
      downDisable[index].isclikdown = true
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { downDisable }
      })
    }
    dispatch({
      type: `${namespace}/dowmfa`,
      payload: item.hid
    })
  }
  let pageProps = {
    // ---------- 界面部分 ----------
    ui: {
      // 页面接口地址
      api_url: `3rd/commissionInvoice/queryCommissionInvoiceDetail`,
      //api_url: `admin/news/list`,
      // 接口方式
      method: "POST",
      // "data_field_name":"data",
      app: "",
      // 接口参数
      params: {
        // type:2
      },
      // 模拟数据 - 用于开发需要，若填充了上面的api_url之后，请将此项设置为null
      // "mockData": mockData,
      mockData: null,
      // 查询栏
      search_bar: {
        fields: [
          {
            en_name: 'regionId',
            zh_name: '所属区域',
            elem_type: 'Select',
            elem_valid_type: 'string',
            //关联的更改的搜索字段
            cmpt_items: area1,
          },
          {
            en_name: 'province',
            zh_name: '所属城市',
            elem_type: 'Cascader',
            elem_valid_type: 'string',
            changeOnSelect: true,
            cmpt_items: areaList,
            split_keys: ['provinceCode', 'cityCode'],
            onFocus: () => {
              area1.map((item, index) => {
                // console.log(biz.queryForm.regionId,item.value)
                if (biz.queryForm && biz.queryForm.regionId && biz.queryForm.regionId == item.value) {
                  // console.log(biz.queryForm.regionId,item.value)
                  dispatch({
                    type: `${namespace}/updateStore`,
                    payload: {
                      areaList: item.children,
                    }
                  })
                }
              })
            },
          },
          {
            en_name: 'productId',
            zh_name: '项目名称',
            elem_type: 'Select',
            elem_valid_type: 'string',
            // showSearch:true,
            cmpt_items: products,
            onFocus: () => {
              if (biz.queryForm && biz.queryForm.cityCode && biz.queryForm.cityCode) {
                dispatch({
                  type: `${namespace}/getProduct`,
                  payload: {
                    cityCode: biz.queryForm.cityCode,
                  }
                })
              }
            },
          },
          {
            en_name: 'vbillNo',
            zh_name: '佣金单号',
            elem_type: 'Input',
            elem_valid_type: 'string',
          },
          {
            en_name: 'writeOffStatus',
            zh_name: '核销状态',
            elem_type: 'Select',
            cmpt_items: writeOffList,
            elem_valid_type: 'string',
          },
          {
            en_name: 'taxServiceStatus',
            zh_name: '服务费结算状态',
            elem_type: 'Select',
            cmpt_items: taxServiceStatusList,
            elem_valid_type: 'string',
          },
          {
            en_name: 'validTime',
            zh_name: '分佣时间',
            elem_type: 'Date',
            format: 'YYYY-MM-DD',
            // query_format: "YYYY-MM-DD HH:mm:ss",   // 请求参数, 当请求参数和显示时格式不同可通过该参数区分
            // double: true,  // 日期范围组件 使用"YYYY-MM-DD HH:mm:ss"格式时, 显示不全时可使用该参数, 将占据两格位置
            split_keys: ['commissionSharingStartTime', 'commissionSharingEndTime'],
            elem_valid_type: 'string'
          },
          {
            en_name: 'taxSyncStatus',
            zh_name: '同步网盈状态',
            elem_type: 'Select',
            cmpt_items: taxSyncStatusList,
            elem_valid_type: 'string',
          },
        ],
        searchHandler: () => { // 自定义搜索按钮回调函数，点击搜索时触发
          console.log('search click')
        },
        resetHandler: () => { // 自定义重置按钮回调函数，点击重置时触发
          console.log('reset click')
        },
        searchCallback: params => { // 自定义搜索完成后的后调函数, 搜索完成后触发, 并将本次搜索的参数传入
          console.log('search finish', params)
        },
        pasteTargetList: [  // 列表组件中将输入框的en_name作为默认id(也可以通过id另外设置)
          'channel',  // 将需要粘贴事件拦截的输入框id以数组的形式传入, 该参数对应PasteFromClipboard组件的targetList参数
        ]
      },
      // 数据表格  序号 资讯标题 所属项目  所属城市 创建人 创建时间 更新人 更新时间   操作
      table:
      {
        status_params: "status=0",
        status_text: "全部",
        // 表头字段列表
        scroll: { x: 2400 },
        fields: [
          {
            en_name: "vbillNo",
            zh_name: "佣金申请单号",
            width: 150,
          },
          {
            en_name: "fkBillNo",
            zh_name: "费控申请单号",
            width: 150,
          },
          {
            en_name: "zjPayBillNo",
            zh_name: "资金付款单号",
            width: 150,
          },
          {
            en_name: "zjPayTime",
            zh_name: "付款时间",
            width: 150,
          },
          {
            en_name: "projectName",
            zh_name: "项目名称",
            width: 150,
          },
          {
            en_name: "summoneySq",
            zh_name: "打款金额",
          },
          {
            en_name: "summoneySf",
            zh_name: "服务金额",
          },
          {
            en_name: "commissionSharingTime",
            zh_name: "分佣时间",
          },
          {
            en_name: "taxSyncStatus",
            zh_name: "同步网盈状态",
            width: 80,
            render: function (val, item) {
              let a = null
              switch (val) {
                case "0":
                  a = '未同步'
                  break
                case "1":
                  a = '已完成'
                  break
                case "2":
                  a = '处理中'
                  break
                case "3":
                  a = '处理失败'
                  break
                case "4":
                  a = '已开票'
                  break
              }
              return a
            }
          },
          {
            en_name: "taxSyncTime",
            zh_name: "同步网盈时间",
            width: 150,
          },
          {
            en_name: "taxSyncMsg",
            zh_name: "同步网盈消息",
            width: 150,
          },
          {
            en_name: "writeOffStatus",
            zh_name: "费控发票核销状态",
            width: 100,
            render: function (val, item) {
              let a = null
              switch (val) {
                case "-1":
                  a = '核销异常'
                  break
                case "0":
                  a = '未核销'
                  break
                case "1":
                  a = '已核销'
                  break
              }
              return a
            }
          },
          {
            en_name: "writeOffTime",
            zh_name: "费控发票核销时间",
            width: 150,
          },
          {
            en_name: "writeOffMsg",
            zh_name: "费控发票核销消息",
            width: 150,
          },
          {
            en_name: "taxServiceStatus",
            zh_name: "服务费结算状态",
            width: 80,
            render: function (val, item) {
              // -2锁定异常 -1结算异常 0未结算 1已锁定 2已结算
              let a = null
              switch (val) {
                case "0":
                  a = '未结算'
                  break
                case "1":
                  a = '已锁定'
                  break
                case "2":
                  a = '已结算'
                  break
                case "-1":
                  a = '结算异常'
                  break
                case "-2":
                  a = '锁定异常'
                  break
              }
              return a
            }
          },
          {
            en_name: "taxServiceTime",
            zh_name: "服务费结算时间",
            width: 150,
          },
          {
            en_name: "edit",
            zh_name: "发票下载",
            fixed: 'right',
            render: (a, item, index, d, e, f) => {
              return (
                <span>
                  {
                    downDisable[index] && downDisable[index].isclikdown ?
                      <span style={{ color: '#999' }}>下载</span>
                      :
                      <a style={{ color: item.taxSyncStatus == 4 ? '#0877FD' : '#999' }} onClick={() => downImg(item, index)} >下载</a>
                  }
                </span>
              )
            },
          },
        ]
      },
      // 操作栏
      action_bar: [
        {
          label: '导出',
          btnId: '70202',
          type: 'primary',
          onClick: (e, row) => {
            down()
          }
        },
        // {
        //   label: '发票下载',
        //   btnId: '70202',
        //   type: 'primary',
        //   onClick: (e, row) => {
        //     down()
        //   }
        // },
      ]
    },
  }

  if (!!modelObj.biz) {
    pageProps.biz = modelObj.biz
    pageProps.biz.syncBackCbf = (biz) => {
      dispatch({
        type: `${namespace}/updateStore`,
        payload: { biz }
      })
    }
  }
  const rowSelection = {
    fixed: true,
    onChange: (selectedRowKeys, selectedRows) => {
      console.log('勾选切换', selectedRowKeys, selectedRows)
    }
  }
  return (
    <div className={cx('pageLayout')}>
      <ListPage pageProps={pageProps} onRef={(ref) => { $child = ref }} />
    </div>
  )
}
// 连接视图(view)和模型(model)
export default connect(mapStateToProps)(Form.create()(commissionPaymentListView))
